<style>
    .rich-table-cell{
        font-size:15px;
    }
</style>
<f:view>
    <a4j:region>
    <h:form>
        <h:panelGrid columns="3" >
            <h:outputText value="Community Postings of #{sessionBean.ejbSession.currentSite.site}" style="font-size: 20px; font-weight: bold;"/>
            <c:if test="${!empty sessionBean.areasCurrentSite}" >
            <h:outputText value=", " style="font-size: 20px; font-weight: bold;"/>
            <h:selectOneMenu id="area" value="#{adminBean.areaId}" >
                    <f:selectItem
                        itemValue="0"
                        itemLabel="All Areas"/>
                <c:forEach var="area" items="#{sessionBean.areasCurrentSite}" >
                    <f:selectItem
                        itemValue="#{area.id}"
                        itemLabel="#{area.area}"/>
                </c:forEach>
                <a4j:support event="onchange" action="#{adminBean.changeCurrentArea}" reRender="communityPostingsForm"/>
            </h:selectOneMenu>
            </c:if>
        </h:panelGrid>
    </h:form>
    <div align="center">
    <h:form>
        <h:panelGroup id="searchMessages" ><h:messages style="color: red" styleClass="errorMessage" /></h:panelGroup>
        <h:panelGrid columns="3" >
            <h:panelGrid columns="6" >
                <h:outputText value="Search for:"/>
                <h:inputText id="searchValue" maxlength="50" value="#{communityBean.searchValue}" />
                <h:outputText value="in:"/>
                <h:selectOneMenu id="communityCategorie" value="#{communityBean.communityCategorieId}" >
                        <f:selectItem
                            itemValue="0"
                            itemLabel="All Communities"/>
                    <c:forEach var="categorie" items="#{adminBean.communityCategories}" >
                        <f:selectItem
                            itemValue="#{categorie.id}"
                            itemLabel="#{categorie.categorie}"/>
                    </c:forEach>
                </h:selectOneMenu>
            </h:panelGrid>
            <a4j:commandButton id="submit" type="submit" value="Search" reRender="searchMessages,communityPostingsForm" />
            <h:panelGroup>
                <h:selectBooleanCheckbox value="#{communityBean.onlySearchTitles}" /><h:outputText value="only search titles"/>
                <h:selectBooleanCheckbox value="#{communityBean.hasImage}" /><h:outputText value="has image"/>
            </h:panelGroup>
        </h:panelGrid>
    </h:form>
    <a4j:status startText="Searching..." stopText="Complete" />
    </a4j:region>
    <h:form id="communityPostingsForm">
        <rich:dataTable id="communityPostingsTable" rows="5" value="#{communityBean.listCommunitis}" var="community" border="1" >
            
            <rich:column>
                <f:facet name="header">
                    <h:outputText value="Publish Date" />
                </f:facet>
                <h:outputText value="#{community.publishDate}" >
                    <f:convertDateTime type="date" dateStyle="medium"/>
                </h:outputText>
            </rich:column>
            
            <rich:column>
                <f:facet name="header">
                    <h:outputText value="Title" />
                </f:facet>
                <h:outputLink value="/site/faces/posting.html?site=#{sessionBean.ejbSession.currentSite.id}&type=community&id=#{community.id}" >
                    <h:outputText value="#{community.title}"/>
                </h:outputLink>
                <h:outputText value=" - (#{community.location})" rendered="#{community.location!=null && community.location!=''}"/>
            </rich:column>
            
            <rich:column rendered="#{communityBean.communityCategorieId==0}">
                <f:facet name="header">
                    <h:outputText value="Categorie" />
                </f:facet>
                <h:outputText value="#{community.categorie}" />
            </rich:column>
            
        </rich:dataTable>
        <rich:spacer height="10" />
        <rich:datascroller for="communityPostingsTable" page="#{communityBean.page}" maxPages="5" />
    </h:form>
    </div>
    <h:form>
        <h:commandLink value="Back to Welcome Page" action="#{communityBean.backEdit}" />
    </h:form>
    <rich:separator height="1" />
</f:view>